import "./header.scss";
import { Link } from "react-router-dom";
import { TextField } from "../textfield/textfield";
import avator from "../../assets/img/avator.avif";
interface HeaderProps {
  imgSrc?: string;
  link?: string;
  userAuth?: string;
}

export const Header = ({
  imgSrc = avator,
  link = "",
  userAuth = "管理员",
}: HeaderProps): React.ReactElement => {
  return (
    <>
      <div className="dashboard_header">
        <TextField type="search" placeholder="搜索用户数据" id={1579513} />
        {link ? (
          <div className="dashboard_auth_box">
            <span className="dashboard_user_auth">{userAuth}</span>
            <Link to={link}>
              <img className="dashboard_img" src={imgSrc} alt="" />
            </Link>
          </div>
        ) : (
          <div className="dashboard_auth_box">
            <span className="dashboard_user_auth">{userAuth}</span>
            <img className="dashboard_avator" src={imgSrc} alt="" />
          </div>
        )}
      </div>
    </>
  );
};
